<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="C" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: 郑帅
  Date: 2019/8/17
  Time: 14:58
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>

<script src="<c:url value="/layui/layui.js"/>"></script>
<link rel="stylesheet" type="text/css" href="<c:url value="/layui/css/layui.css"/>">

<style>
    .container {
        margin: 20px 20px;
    }

</style>

<body>

<div class="container">
    客 户：
    <div class="layui-inline">
        <input class="layui-input" name="id" id="CustomerName" autocomplete="off">
    </div>

    客户经理：
    <div class="layui-inline">
        <select name="interest" style="width:100px;height: 35px" id="CustomerManager">
            <option value="" selected="">全部</option>
            <c:forEach items="${sessionScope.normalList}" var="normal">
                <option value="${normal.real_name}">
                        ${normal.real_name}
                </option>
            </c:forEach>

        </select>
    </div>

    状态:
    <div class="layui-inline">
        <select name="interest" lay-verify="required" style="width:100px;height: 35px" id="status">
            <OPTION selected value="">全部</OPTION>
            <OPTION value="0">确认流失</OPTION>
            <OPTION value="1">预警</OPTION>
            <OPTION value="2">暂缓流失</OPTION>
            <OPTION value="-1">申请流失</OPTION>
        </select>
    </div>
    &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp

    <button class="layui-btn" data-type="reload" id="ss">搜索</button>
    <table class="layui-hide" id="test" lay-filter="test" height=100></table>

    <script src="<c:url value="/layui/layui.js"/>" charset="utf-8"></script>
    <script src="<c:url value="/js/jquery-1.9.1.min.js"/>"></script>
    <script type="text/html" id="barDemo">
        {{# if(d.status!=0 && d.status!=-1){ }}
        <a class="layui-btn layui-btn-xs layui-layout-body" lay-event="edit" target="_self">暂缓流失</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs layui-layout-right" lay-event="applyFor">申请流失</a>
        {{# }  }}
    </script>
    <script>
        $(function () {
            layui.use('table', function () {
                var table = layui.table;
                table.render({
                    elem: '#test',
                    url: '<c:url value="/customerLoss.do"/>',
                    cellMinWidth: 95,
                    page: true,
                    limits: [5, 10, 15, 20],
                    limit: 5,
                    id: "forReload",
                    height: "420px",

                    cols: [[
                        {type: 'numbers', title: '编号', minWidth: 100, align: "center"},
                        {field: 'name', templet: '<div>{{d.customer.name}}</div>', title: '客户名称', align: 'center'},
                        {
                            field: 'name',
                            templet: '<div>{{d.customer.normal.realName}}</div>',
                            title: '客户经理',
                            align: 'center',
                            minWidth: 150
                        },
                        {field: 'lastOrderTime', title: '上次下单时间', minWidth: 100, align: "center", width: 238},
                        {field: 'lossDate', title: '确认流失时间', align: 'center', width: 200},
                        {
                            field: 'status',
                            templet: '<div>{{d.status==0?"确认流失":d.status==1?"预警":d.status==-1?"申请流失":"暂缓流失"}}</div>',
                            title: '状态',
                            align: 'center',
                            width: 200
                        },
                        {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150}
                    ]]

                });

                var $ = layui.$, active = {
                    reload: function () {
                        let byCustomerName = $('#CustomerName');
                        let byCustomerManager = $('#CustomerManager');
                        let byStatus = $('#status');
                        //执行重载
                        table.reload('forReload', {
                            url: '${pageContext.request.contextPath}/customerLoss.do',
                            page: {
                                curr: 1 //重新从第 1 页开始
                            }
                            , where: {
                                customerName: byCustomerName.val()
                                , customerManager: byCustomerManager.val()
                                , status: byStatus.val()
                            }
                        }, 'data');
                    }
                };

                table.on('tool(test)', function (obj) {
                    var id = obj.data.id;
                    if (obj.event === 'applyFor') {
                        layer.confirm('确定要申请流失?', function (index) {
                            $.ajax({
                                url: "${pageContext.request.contextPath}/customerLossApplyFor/" + id + ".do"
                                , type: 'put'
                            });
                            layer.close(index);
                            active.reload();
                        });
                    } else if (obj.event === 'edit') {
                        location = '${pageContext.request.contextPath}/view/customer/delayLoass.jsp?id=' + id + ''
                    }
                });

                $("#ss").click(function () {
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';

                })
            });

            function qrLs(id) {
                //  确认流失
            }

            function zhLs(id) {

                <%--location.href = '<c:url value="/#?id="/>' + id;--%>
                //展缓流失

            }

        })
    </script>
</div>

</body>
</html>
